<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<title>海科集团任务监督管理系统-任务查询</title>
<style>
#center {
	/* 	width: 1100px; */
	margin: 0 auto;
}
</style>
</head>
<body>
	<%@ include file="TaskHeader.jsp"%>
	<script>
		$(document).ready(function() {
			$("#task a .out").stop().animate({
				'top' : '48px'
			}, 300); // move down - hide
			$("#task a .over").stop().animate({
				'top' : '0px'
			}, 300); // move down - show
		});
	</script>
	<div id="center">
		<div style="margin: 20px 0;"></div>
		<div style="float: left;">
			<input id="yaw" type="hidden" value="${yaw}" /> <span>督办事项：<input
				name="queryname" id="queryname" class="easyui-textbox"
				style="width: 180px;"></span> <a href="javascript:void(0)"
				class="easyui-linkbutton" onclick="queryForm()" style="width: 80px">查询</a>
		</div>
		<div style="float: left;">
			<select class="easyui-combobox" name="state" id="state" label=""
				labelPosition="left" style="width: 180px;">
				<option value="0">待办事项</option>
				<option value="1">已办事项</option>
				<!-- 					<option value="all">全部</option> -->
			</select>&nbsp;&nbsp;&nbsp;
		</div>
		<br>
		<div class="clear"></div>
		<div style="margin: 20px 0;">
			<table class="easyui-datagrid" id="tttask">
			</table>
		</div>
	</div>
	<div id="dlg" class="easyui-dialog"
		style="width: 700px; height: 600px;"
		data-options="closed:true,modal:true,border:'thin',buttons:'#dlg-buttons'">
		<form id="fm" method="post" novalidate
			style="margin: 0; padding: 20px 50px" enctype="multipart/form-data">
			<table class="table">
				<tr>
					<td class="left"><span>会议名称:</span></td>
					<td><span id="meetName"></span></td>
				</tr>
				<tr style="height: 18px;"></tr>
				<tr>
					<td class="left"><span>督办事项:</span></td>
					<td><span id="surpviseName"></span></td>
				</tr>
				<tr style="height: 28px;"></tr>
				<tr>
					<td class="left"><span>本周工作:</span><input id="infid"
						type="hidden" /></td>
					<td><textarea name="taskinfo" id="taskinfo" cols="60" rows="7"
							style="OVERFLOW: hidden"></textarea></td>
				</tr>
				<tr style="height: 28px;"></tr>
				<tr>
					<td class="left"><span>整体进度:</span></td>
					<td><input class="easyui-slider" style="width: 300px"
						id="slideProgress"
						data-options="showTip:true,
                rule: [0,'|',20,'|',40,'|',60,'|',80,'|',100]"
						value="0"></td>
				</tr>
				<tr style="height: 38px;"></tr>
				<tr>
					<td style="width: 120px;" class="left"><span>计划完成时间:</span></td>
					<td><input class="easyui-datebox" id="datePlan"
						required="required" style="width: 180px;"> <br /></td>
				</tr>
				<tr>
					<td>附件：</td>
					<td>
						<!-- 						<div class="formtitle upLoad">附件上传</div> -->
						<div class="chooseFile" style="height: 30px;">
							<table>
								<tr>
									<td><input type="button" id="uploadbtn" value="选择文件..." />
										<input type="file" id="uploadpicker" accept=""
										onchange="changeFile()" multiple style="display: none;" /></td>
									<td>
										<div>
											<ul id="checkfileList"></ul>
										</div>
									</td>
								</tr>
							</table>
						</div>
						</div>
					</td>
				</tr>

			</table>
		</form>
	</div>
	<div id="dlg-buttons">
		<a href="javascript:void(0)" class="easyui-linkbutton c6"
			iconCls="icon-save" onclick="save()" style="width: 90px">保存</a> <a
			href="javascript:void(0)" class="easyui-linkbutton c6"
			iconCls="icon-ok" onclick="commit()" style="width: 90px">提交</a> <a
			href="javascript:void(0)" class="easyui-linkbutton"
			iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')"
			style="width: 90px">关闭</a>
	</div>
	<div id="dlgDelayList" class="easyui-dialog"
		style="width: 700px; height: 300px;"
		data-options="closed:true,modal:true,border:'thin'">
		<table class="easyui-datagrid" id="tttaskDelayList">
		</table>
	</div>
	<div id="dlgDelay" class="easyui-dialog"
		style="width: 700px; height: 350px;"
		data-options="closed:true,modal:true,border:'thin',buttons:'#dlgDelay-buttons'">
		<form id="fmDelay" method="post" novalidate
			style="margin: 0; padding: 20px 50px" enctype="multipart/form-data">
			<table class="table">
				<tr>
					<td class="left"><span>延期原因:</span></td>
					<td><textarea name="taskinfoDelay" id="taskinfoDelay"
							cols="60" rows="7" style="OVERFLOW: hidden"></textarea></td>
				</tr>
				<tr style="height: 38px;"></tr>
				<tr>
					<td style="width: 120px;" class="left"><span>延期时间:</span></td>
					<td><input class="easyui-datebox" id="datePlanDelay"
						required="required" style="width: 180px;"> <br /></td>
				</tr>
			</table>
		</form>
	</div>
	<div id="dlgDelay-buttons">
		<a href="javascript:void(0)" class="easyui-linkbutton c6"
			iconCls="icon-ok" onclick="saveDelay()" style="width: 90px">提交</a> <a
			href="javascript:void(0)" class="easyui-linkbutton"
			iconCls="icon-cancel"
			onclick="javascript:$('#dlgDelay').dialog('close')"
			style="width: 90px">关闭</a>
	</div>
	<div class="loadinghk">
		<div style="top: 50%; left: 50%; position: absolute;">
			<img src="resourse/img/load.gif" />
		</div>
	</div>
	<script>
		var selectedFileList = [];//已选文件列表
		// 		var sselectedFileNameList = [];
		var paramTaskId = "";//请求参数
		var succsessCount = 0;//上传成功文件个数
		var errorCount = 0;//上传失败文件个数
		function changeFile() {
			var files = $("#uploadpicker").prop("files");
			$
					.each(
							files,
							function(index, item) {
								var choiseFile = $("#checkfileList>li");
								if (choiseFile.length > 0) {//文件去重
									var count = 0;
									$.each(choiseFile, function(index1, item1) {
										if (item.name == item1.innerText) {
											count++;
										}
									});
									if (count == 0) {
										if (checkFileLength(item.size)) {
											$("#checkfileList")
													.append(
															"<li class=\"fileinfo\">"
																	+ item.name
																	+ "<a style=\"display: none; color: red; margin-left: 10px;\" href=\"javascript:void(0)\" onclick=\"RemoveFile(this,'"
																	+ item.name
																	+ "')\">删除</a>"
																	+ "</li>");
											selectedFileList.push(item);
											// 											sselectedFileNameList
											// 													.push(item.name);
											AddMoushover();
										}
									}
								} else {
									if (checkFileLength(item.size)) {
										$("#checkfileList")
												.append(
														"<li class=\"fileinfo\">"
																+ item.name
																+ "<a style=\"display: none; color: red; margin-left: 10px;\" href=\"javascript:void(0)\" onclick=\"RemoveFile(this,'"
																+ item.name
																+ "')\">删除</a>"
																+ "</li>");
										selectedFileList.push(item);
										// 										sselectedFileNameList.push(item.name);
										AddMoushover();
									}
								}
							});
		}
		//上传文件
		function uploadFile(row) {
			$('.loadinghk').show();
			if (selectedFileList.length > 0) {
				$.each(selectedFileList, function(index, item) {
					var dataform = new FormData();
					dataform.append("file", item);
					var xmlhttp = null;
					if (window.XMLHttpRequest) {// code for all new browsers
						xmlhttp = new XMLHttpRequest();
					} else if (window.ActiveXObject) {// code for IE5 and IE6
						xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
					}
					if (xmlhttp != null) {
						xmlhttp.open("POST", "file/springUpload?fileRow=" + row
								+ "&fileTable=at_projectresult&fileName="
								+ item.name, true);
						xmlhttp.send(dataform);
						xmlhttp.onreadystatechange = callbackMethods;
					} else {
						alert("你的浏览器版本不兼容，请使用更高版本的浏览器");
					}
					function callbackMethods() {
						submitSuccess();
						if (xmlhttp.readyState == 4) {
							if (xmlhttp.status == 200) {
							}
						} else {
							if (xmlhttp.status == 500) {
							}
						}
					}
				});

			} else {
				submitSuccess();
			}
		}
		function submitSuccess() {
			$('.loadinghk').hide()

		}
		//判断文件是否超过限制大小
		function checkFileLength(fileLen) {
			if (fileLen > 41943040) {
				$.messager.alert("提示", "上传文件大小不能超过40M", "error");
				return false;
			}
			return true;
		}
		//移除已选择的文件
		function RemoveFile(obj, filename) {
			$.messager.confirm("提示", "确认删除当前文件?", function(e) {
				if (e) {
					var index = $("#checkfileList>li").index($(obj).parent());
					selectedFileList.splice(index, 1);
					$(obj).parent().remove();
					// 					var index1 = $.inArray(filename, sselectedFileNameList);
					// 					sselectedFileNameList.splice(index1, 1);
					var row = $('#tttask').datagrid("getSelected");
					$.ajax({
						type : "post",
						url : "file/deleteFile",
						data : {
							fileTable : 'at_projectresult',
							fileRow : row["PRO_ID"] + '-' + row["PROR_WEEK"]
									+ '-' + row["PRO_EXECUTEUSERID"],
							fileName : filename
						},
						success : function(data) {
							$.messager.alert('消息', data);
						},
						error : function(XMLHttpRequest, textStatus,
								errorThrown) {
							$.messager.alert('消息', errorThrown);
						}
					});
				}
			});
		}
		//添加鼠标经过事件，鼠标划过时显示“删除”
		function AddMoushover() {
			$(".fileinfo").hover(function() {
				$(this).find("a").last().css("display", "");
			}, function() {
				$(this).find("a").last().css("display", "none");
			});
		}
	</script>
	<script>
		function initcob() {
			$("#state").combobox({
				'editable' : false,
				onChange : function(n, o) {
					bindgrid();
				}
			});
		}
		//获取当前时间，格式YYYY-MM-DD
		function getNowFormatDate() {
			var date = new Date();
			var seperator1 = "-";
			var year = date.getFullYear();
			var month = date.getMonth() + 1;
			var strDate = date.getDate();
			if (month >= 1 && month <= 9) {
				month = "0" + month;
			}
			if (strDate >= 0 && strDate <= 9) {
				strDate = "0" + strDate;
			}
			var currentdate = year + seperator1 + month + seperator1 + strDate;
			return currentdate;
		}
	</script>
	<!-- 主窗体 -->
	<script>
		$(function() {
			initcob();
			bindgrid();
			$('#center').width($(window).width() - 50);
			$("#uploadbtn").bind("click", function(e) {
				$("#uploadpicker").click();
			});
		})
		function queryForm() {
			bindgrid();
		}
		function bindgrid() {
			$('#tttask')
					.datagrid(
							{
								title : '督办任务列表',
								nowrap : false,
								rownumbers : true,
								singleSelect : true,
								collapsible : true,
								width : $(window).width() - 50,
								height : 480,
								pagination : true,
								url : 'task/selectTasks',
								queryParams : {
									"queryname" : $('#queryname').val(),
									"state" : $('#state').combobox('getValue')
								},
								method : 'get',
								columns : [ [
										{
											field : 'INF_ID',
											title : 'ID',
											hidden : true,
											formatter : function(val, rec) {
												return val;
											}
										},
										{
											field : 'INF_METTINGNAME',
											title : '会议名称',
											width : '10%',
											formatter : function(val, rec) {
												return val;
											}
										},
										{
											field : 'PRO_CONTENT',
											title : '督办事项名称',
											// 											width : 200,
											width : '20%',
											formatter : function(val, rec) {
												return val;
											}
										},
										{
											field : 'PRO_CREATEORNAME',
											title : '创建人',
											// 											width : 50,
											formatter : function(val, rec) {
												return val;
											}
										},
										{
											field : 'PROR_CONTENT',
											title : '填报内容',
											width : '25%',
											formatter : function(val, rec) {
												return val;
											}
										},
										{
											field : 'PROR_COMMITTIME',
											title : '提交时间',
											// 											width : 100,
											formatter : function(val, rec) {
												if (val != null) {
													return (val + '').substr(0,
															10);
												} else {
													return val;
												}
											}
										},
										{
											field : 'PROR_PROGRESS',
											title : '进度',
											// 					width : 200,
											formatter : function(val, rec) {
												if (val == null) {
													val = 0;
												}
												var tempval = val;
												var htmlstr = '';
												var flag = false;
												//判断是否超期
												if (rec.PRO_VALIDATETIME == null
														&& rec.PRO_PLANFINISHDATE < getNowFormatDate()) {
													flag = true;//当没有完成时间时，与当前时间比较
												}
												if (rec.PRO_VALIDATETIME != null
														&& rec.PRO_PLANFINISHDATE < rec.PRO_VALIDATETIME
																.substr(0, 10)) {
													flag = true;//当有完成时间时，与完成时间比较
												}
												if (flag) {
													htmlstr = '<div class="easyui-progressbar progressbar" style="width: 70px;font-weight:bold; " value="'
															+ tempval
															+ '" text="'
															+ tempval
															+ '%">'
															+ '<div class="progressbar-text" style="width: 70px; height: 20px; line-height: 20px;color:red;font-weight:bold;">'
															+ tempval
															+ '%</div>'
															+ '<div class="progressbar-value" style="width: '
															+ tempval
															+ '%; height: 20px; line-height: 20px; color:red;font-weight:bold;">'
															+ '<div class="progressbar-text" style="width: 70px; height: 20px; line-height: 20px;color:red;font-weight:bold;">'
															+ tempval
															+ '%</div>'
															+ '</div>'
															+ '</div>';
												} else {
													htmlstr = '<div class="easyui-progressbar progressbar" style="width: 70px; " value="'
															+ tempval
															+ '" text="'
															+ tempval
															+ '%">'
															+ '<div class="progressbar-text" style="width: 70px; height: 20px; line-height: 20px;">'
															+ tempval
															+ '%</div>'
															+ '<div class="progressbar-value" style="width: '
															+ tempval
															+ '%; height: 20px; line-height: 20px;">'
															+ '<div class="progressbar-text" style="width: 70px; height: 20px; line-height: 20px;">'
															+ tempval
															+ '%</div>'
															+ '</div>'
															+ '</div>';
												}
												return htmlstr;
											}
										},
										{
											field : 'PRO_PLANFINISHDATE',
											title : '计划完成时间',
											// 											width : 100,
											formatter : function(val, rec) {
												if (val != null) {
													return (val + '').substr(0,
															10);
												} else {
													return val;
												}
											}
										},
										{
											field : 'PRO_VALIDATETIME',
											title : '实际完成时间',
											// 											width : 100,
											formatter : function(val, rec) {
												if (val != null) {
													return (val + '').substr(0,
															10);
												} else {
													return val;
												}
											}
										},
										{
											field : 'edit',
											title : '',
											width : 40,
											formatter : function(val, rec,
													index) {
												if ($('#state').combobox(
														'getValue') == '0') {
													var str = '<a href="javascript:void(0)" onclick="editForm('
															+ index
															+ ')">编辑</a>';
													return str;
												} else {
													var str = '<a href="javascript:void(0)" onclick="editForm('
															+ index
															+ ')">查看</a>';
													return str;
												}
											}
										},
										{
											field : 'delay',
											title : '',
											width : 40,
											formatter : function(val, rec,
													index) {
												var str = '<a href="javascript:void(0)" onclick="delayForm('
														+ index + ')">延期</a>';
												return str;
											}
										},
										{
											field : 'delayList',
											title : '',
											width : 65,
											formatter : function(val, rec,
													index) {
												var str = '<a href="javascript:void(0)" onclick="delayFormList('
														+ index + ')">延期记录</a>';
												return str;
											}
										} ] ],
								toolbar : [],
								onLoadSuccess : function() {
								},
								onDblClickRow : function() {
								}
							});
		}
	</script>
	<script>
		function bindgridDelay(row) {
			$('#tttaskDelayList').datagrid({
				title : '',
				nowrap : false,
				rownumbers : true,
				singleSelect : true,
				collapsible : true,
				width : 500,
				height : 200,
				// 				pagination : true,
				url : 'task/selectTasksDelay',
				queryParams : {
					"proId" : row["PRO_ID"]
				},
				method : 'get',
				columns : [ [ {
					field : 'LEV_RESON',
					title : '申请原因'
				}, {
					field : 'LEV_OLDDATE',
					title : '修改前时间',
					formatter : function(val, rec) {
						return val;
					}
				}, {
					field : 'LEV_NEWDATE',
					title : '修改后时间',
					formatter : function(val, rec) {
						return val;
					}
				} ] ]
			})
		}
		function delayForm(rowindex) {
			$('#dlgDelay').dialog('open').dialog('center').dialog('setTitle',
					'延期申请');
			$('#fmDelay').form('clear');
			var rows = $('#tttask').datagrid("getRows");
			var row = rows[rowindex];
			$('#infid').val(row['INF_ID']);

		}
		function delayFormList(rowindex) {
			$('#dlgDelayList').dialog('open').dialog('center').dialog(
					'setTitle', '延期申请列表');
			var rows = $('#tttask').datagrid("getRows");
			var row = rows[rowindex];
			bindgridDelay(row);
		}
		function saveDelay() {
			if (!$('#fmDelay').form('validate')) {
				return;
			}
			if ($('#taskinfoDelay').val() == '') {
				$.messager.alert('消息', '请填写延期原因');
				return;
			}
			var row = $('#tttask').datagrid('getSelected');
			$.messager.confirm('请确认', '提交后无法修改，确认提交?', function(r) {
				if (r) {
					$.ajax({
						type : "post",
						url : "task/saveProjectresultDelay",
						data : {
							inf_id : $('#infid').val(),
							content : $('#taskinfoDelay').val(),
							planDateNew : $('#datePlanDelay')
									.datebox('getText'),
							planDateOld : row["PRO_PLANFINISHDATE"],
							proId : row["PRO_ID"]
						},
						success : function(data) {
							$.messager.alert('消息', data);
							if (data == '保存成功!') {
							}
							$('#dlgDelay').dialog('close');
							bindgrid();//因为关闭窗口，所以刷新 
						},
						error : function(XMLHttpRequest, textStatus,
								errorThrown) {
							$.messager.alert('消息', errorThrown);
						}
					});
				}
			})
		}
	</script>
	<script>
		function editForm(rowindex) {
			$('#dlg').dialog('open').dialog('center').dialog('setTitle',
					'任务填报（友情提示：本周只可提交一次）');
			$('#fm').form('clear');
			var rows = $('#tttask').datagrid("getRows");
			var row = rows[rowindex];
			console.log(row);
			getFileList(row["PRO_ID"] + '-' + row["PROR_WEEK"] + '-'
					+ row["PRO_EXECUTEUSERID"]);
			$('#infid').val(row['INF_ID']);
			$('#taskinfo').val(row['PROR_CONTENT']);
			$('#surpviseName').html(row['PRO_CONTENT']);
			$('#meetName').html(row['INF_METTINGNAME']);
			if (row['PROR_PROGRESS'] != null) {
				$('#slideProgress').slider('setValue', row['PROR_PROGRESS']);//保存后从result表中提取本周值
			} else {
				$('#slideProgress').slider('setValue', row['PRO_COEE']);//第一次从project表中提取，因为本周还没录入进度
			}
			setPlandate(row['PRO_PLANFINISHDATE'], row["PRO_ID"]);//当第一次提交后计划日期不可再变 
			if (row['PROR_COMMITTIME'] != null) {
				$('#dlg-buttons').hide();
			} else {
				$('#dlg-buttons').show();
			}
		}
		function getFileList(row) {
			$.ajax({
				type : "post",
				url : "file/getFileList",
				data : {
					fileTable : "at_projectresult",
					fileRow : row
				},
				success : function(data) {
					var dataArray = eval(data);
					initFile(dataArray);
				},
				error : function(XMLHttpRequest, textStatus, errorThrown) {
					$.messager.alert('消息', errorThrown);
				}
			});
		}

		function initFile(dataArray) {
			$("#checkfileList").empty();
			// 			sselectedFileNameList = [];
			selectedFileList = [];
			dataArray
					.forEach(function(e, i, a) {
						$("#checkfileList")
								.append(
										"<li class=\"fileinfo\">"
												+ "<a style=\" color: blue; margin-left: 5px;\" target=_blank href=\"file/download?id="
												+ e.FILE_ID
												+ "\">"
												+ e.FILE_NAME
												+ "</a>"
												+ "<a style=\"display: none; color: red; margin-left: 30px;\" href=\"javascript:void(0)\" onclick=\"RemoveFile(this,'"
												+ e.FILE_NAME + "')\">删除</a>"
												+ "</li>");
						// 						sselectedFileNameList.push(e.FILE_NAME);
						AddMoushover();
					});
		}

		function setPlandate(plandate, proId) {
			$.ajax({
				type : "post",
				url : "task/selectResultCommitNum",
				data : {
					inf_id : $('#infid').val(),
					proId : proId
				},
				success : function(data) {
					if (data > 0) {
						$('#datePlan').datebox('readonly');
					} else {
						$('#datePlan').datebox('readonly', false);
					}
					$('#datePlan').datebox('setValue', plandate);
					$('#datePlan').datebox('setText', plandate);
				},
				error : function(XMLHttpRequest, textStatus, errorThrown) {
					$.messager.alert('消息', errorThrown);
				}
			});
		}
		function commit() {
			if (!$('#fm').form('validate')) {
				return;
			}
			if ($('#datePlan').datebox('getText') == null) {
				$.messager.alert('消息', '请选择计划完成日期');
			}
			var row = $('#tttask').datagrid('getSelected');
			var yaw = $('#yaw').val();//当年月为空时


			$.messager.confirm('请确认', '本周只能提交一次，提交后无法修改，确认提交?', function(r) {
				if (r) {
					uploadFile(row["PRO_ID"] + '-' + yaw + '-'
							+ row["PRO_EXECUTEUSERID"]);
					$('.loadinghk').show();
					$.ajax({
						type : "post",
						url : "task/commitProjectresult",
						data : {
							inf_id : $('#infid').val(),
							content : $('#taskinfo').val(),
							progress : $('#slideProgress').slider('getValue'),
							planDate : $('#datePlan').datebox('getText'),
							proId : row["PRO_ID"]
						},
						success : function(data) {
							$('.loadinghk').hide();
							$.messager.alert('消息', data);
							if (data == '提交成功!') {
								$('#dlg').dialog('close');
								bindgrid();//因为关闭窗口，所以刷新 
							}
						},
						error : function(XMLHttpRequest, textStatus,
								errorThrown) {
							$('.loadinghk').hide();
							$.messager.alert('消息', errorThrown);
						}
					});
				}
			});
		}

		function save() {
			if (!$('#fm').form('validate')) {
				return;
			}
			if ($('#datePlan').datebox('getText') == null) {
				$.messager.alert('消息', '请选择计划完成日期');
			}
			var row = $('#tttask').datagrid('getSelected');
			var yaw = $('#yaw').val();//当年月为空时

			uploadFile(row["PRO_ID"] + '-' + yaw + '-'
					+ row["PRO_EXECUTEUSERID"]);
			$('.loadinghk').show();
			$.ajax({
				type : "post",
				url : "task/saveProjectresult",
				data : {
					inf_id : $('#infid').val(),
					content : $('#taskinfo').val(),
					progress : $('#slideProgress').slider('getValue'),
					planDate : $('#datePlan').datebox('getText'),
					proId : row["PRO_ID"],
				},
				success : function(data) {
					$('.loadinghk').hide();
					$.messager.alert('消息', data);
					if (data == '保存成功!') {
					}
					$('#dlg').dialog('close');
					bindgrid();//因为关闭窗口，所以刷新 
				},
				error : function(XMLHttpRequest, textStatus, errorThrown) {
					$('.loadinghk').hide();
					$.messager.alert('消息', errorThrown);
				}
			});
		}
	</script>
</body>
</html>